🌍📖 A readable, automated, and optimized (3 kb) internationalization for JavaScript
Documentation · Quickstart · Example · Support · Contribute · License
Internationalization is the design and development of a product, application or document content that enables easy localization for target audiences that vary in culture, region, or language.
Lingui is an easy yet powerful internationalization framework for global projects.
-
Clean and readable - Keep your code clean and readable, while the library uses battle-tested and powerful ICU MessageFormat under the hood.
-
Universal - Use it everywhere.
@lingui/coreprovides the essential intl functionality which works in any JavaScript project while@lingui/reactoffers components to leverage React rendering. -
Full rich-text support - Use React components inside localized messages without any limitation. Writing rich-text messages is as easy as writing JSX.
-
Powerful tooling - Manage the whole intl workflow using Lingui CLI. It extracts messages from source code, validates messages coming from translators and checks that all messages are translated before shipping to production.
-
Unopinionated - Integrate Lingui into your existing workflow. It supports message keys as well as auto-generated messages. Translations are stored either in JSON or standard PO files, which are supported in almost all translation tools.
-
Lightweight and optimized - Core library is only 1.5 kB gzipped, React components are an additional 1.3 kBs gzipped. That's less than Redux for a full-featured intl library.
-
Active community - Join us on Discord to discuss the latest development. At the moment, Lingui is the most active intl project on GitHub.
-
Compatible with react-intl - Low-level React API is very similar to react-intl and the message format is the same. It's easy to migrate an existing project.
If you're a react-intl user, check out a comparison of react-intl and Lingui.
Short example how i18n looks with JSX:
import { Trans } from "@lingui/macro"
function App() {
return (
<Trans id="msg.docs" /* id is optional */>
Read the <a href="https://lingui.dev">documentation</a>
for more info.
</Trans>
)
}Message from this component will be extracted in following format:
msgid "msg.docs"
msgstr "Read the <0>documentation</0> for more info."For more example see the Examples directory.
If you are having issues, please let us know.
- Join us on Discord to chat with the community.
- Ask questions on StackOverflow and mark it with Lingui tag.
- If something doesn't work as documented, documentation is missing or if you just want to suggest a new feature, create an issue.
- You can also Ask Lingui JS Guru, it is a Lingui JS focused AI to answer your questions.
Contribution to open-source project is everything from spreading the word, writing documentation to implement features and fixing bugs.
- Do you use Lingui in production site? Let us know!
- Have you seen any interesting talk or article about i18n? Share it!
- Have you found a bug or do you want to suggest a new feature? Create an issue!
- Do you want to improve the docs and write some code? Read the contributors guide and send a PR!
This project exists thanks to all the people who contribute. [Contribute].
The project is licensed under the MIT license.
